import babel from '@rollup/plugin-babel'
import clear from 'rollup-plugin-clear'
import terser from '@rollup/plugin-terser'
import html from 'rollup-plugin-generate-html-template'
import resolve from '@rollup/plugin-node-resolve'
import replace from '@rollup/plugin-replace'
import serve from 'rollup-plugin-serve'
// 该插件依赖@vue/compiler-sfc，已装
import vue from 'rollup-plugin-vue'
import postcss from 'rollup-plugin-postcss'
import cssnano from 'cssnano'

export default {
  // input: "src/index.js",
  input: {
    // 名称取决于key
    index: "./src/index.js",
    // main:"./src/main.js"
  },
  output: {
    // 如果多入口，必须指定dir，指定存放目录
    dir: "dist",
    // 如果是单入口，就必须通过file指定打包文件名称
    // file: "dist/index.js",
    // 模块化方案
    format: "iife",//使用cjs会报exports is not defined
    name: 'MyBundle' //umd必须加模块名称
  },
  // 注册插件
  plugins: [
    vue(),
    postcss({
      extract: true,
      plugins:[cssnano()]
    }),
    babel({
      babelHelpers: "runtime", //添加了@babel/runtime，必须配置runtime
      exclude: "node_modules/**",
      extensions: ['.js', '.jsx', '.vue']
    }),
    clear({
      // required, point out which directories should be clear.
      targets: ['dist'],
      // 以监视模式调用插件，需要配置rollup --watch / rollup -w
      watch: true, // default: false
    }),
    resolve(),
    // 有识别不了的，替换掉
    replace({
      'process.env.NODE_ENV': JSON.stringify('production'),
      preventAssignment: true
    }),
    // terser(),
    // 根据模板html生成一个html页面，并自动注入打包结果（js/css）
    html({
      // 模板文件
      template: "./src/index.html",
      // 最终生成的html文件
      target: "index.html",
      // attrs: ['type="module"']
    }),
    // 开发服务器
    serve({
      // 基于物理目录
      contentBase: "dist",
      port: 9000,
      open: true,
      host: 'localhost' //0.0.0.0既可以localhost，又可以局域网Ip都可以访问
    })
  ],
  // 指定排除项
  external: []
}
